<template>
    <div>
        <table border="1" cellspacing='0'>
            <tr>
                <td>名称</td>
                <td>图片</td>
                <td>讲师</td>
                <td>操作</td>
            </tr>
            <tr v-for='i in list'>
                <td>{{i.name}}</td>
                <td><img :src='"http://localhost:5000/static/upload/"+i.pic' alt="" width="100" height="100"></td>
                <td>{{i.tname}}</td>
                <td>
                    <router-link :to="{name:'courseupdate',query:{'id':i.id}}">修改</router-link>
                </td>
            </tr>
            <tr>
                <td>
                    <van-pagination
                     v-model="currentPage"
                     :total-items="total" 
                     :items-per-page="size"
                     @change="getlist"
                    />
                </td>
            </tr>
        </table>
    </div>
</template>

<script>
    export default {
        data(){
            return{
                list:[],
                total:0,
                size:3,
                currentPage:1
            }
        },
        methods:{
            getlist(p){
                //更新p
                this.currentPage=p
                this.$axios.get('courseM?page='+p+'&size='+this.size)
                .then(res=>{
                    //获取所有分类信息
                    this.list=res.data.list
                    this.total=res.data.total //获取总页数
                })
            }
        },
        mounted(){
            this.getlist(1)
        },
    }
</script>

<style scoped>

</style>